@url nextSlideImage buttonBarNextSlideImage;
@url spinner spinnerImage;
@url error errorImage;

@if mgwt.css pretty {
	@external pullToRefresh, arrow, mgwt-arrowUp, arrowDown;
}



.pullToRefresh{
	position: relative;
	bottom: 0px;
	left: 0px;
	width: 100%;
	height: 40px;
}


.pullToRefresh .arrow {
	position: absolute;
	
	margin-left: 50px;
	
	width: 40px;
	height: 40px;
	background-image: nextSlideImage;
	background-repeat: no-repeat;
	
	\-webkit-transform: rotate(90deg) translateZ(0);
	\-webkit-transform-origin: 12px 9px;
}

.pullToRefresh .spinner{
	position: absolute;
	margin-left: 50px;
	width: 40px;
	height: 40px;
	background-image: spinner;
	background-repeat: no-repeat;
	\-webkit-animation-duration: 1s;
    \-webkit-animation-iteration-count: infinite;
    \-webkit-animation-timing-function: linear;
    \-webkit-animation-name: progressIndicatorAnimation;
	
}

.pullToRefresh .error{
	position: absolute;
	margin-left: 50px;
	width: 40px;
	height: 40px;
	background-image: error;
	background-repeat: no-repeat;
	
}

@-webkit-keyframes progressIndicatorAnimation {

    0% { -webkit-transform: rotate(0deg); }

    100% { -webkit-transform: rotate(360deg); }

}



.pullToRefresh .text{
	position: absolute;
	top: 0px;
	left: 100px;
	display: inline-block;
}







